/**
 * Copyright (c) 2020 kedacom
 * OpenATC is licensed under Mulan PSL v2.
 * You can use this software according to the terms and conditions of the Mulan PSL v2.
 * You may obtain a copy of Mulan PSL v2 at:
 * http://license.coscl.org.cn/MulanPSL2
 * THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
 * EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
 * MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
 * See the Mulan PSL v2 for more details.
 **/
<template>
  <div :style="{position: 'absolute', left: Data.busleft, top: Data.bustop}" class="southbusmap">
    <div :class="Data.id >= 13 && Data.id <= 16 ? '' : 'hide'">
      <svg
        version="1.1"
        id="图层_1"
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        x="0px"
        y="0px"
        viewBox="0 0 24 91"
        style="enable-background:new 0 0 24 91;"
        xml:space="preserve"
        :width="IconWdith"
        :height="IconLengh"
      >
        <g id="有轨电车-南" v-if="Data.controltype === 5">
          <path
            class="st0"
            d="M24,87V4c0-2.2-1.8-4-4-4H4C1.8,0,0,1.8,0,4v83c0,2.2,1.8,4,4,4h16C22.2,91,24,89.2,24,87z"
          ></path>
          <g>
            <path
              class="st1"
              d="M14.4,44.8L14.4,44.8c-3.4,0-6.2,2.8-6.2,6.2v3.2l-0.5-0.8c0-0.1-0.1-0.1-0.3-0.1c-0.1,0-0.1,0.1-0.3,0.1
l-1.2,3.1c0,0.1,0,0.3,0.1,0.4c0.1,0,0.3,0,0.4-0.1l1-2.6l0.6,1v21.3c0,0.4,0.3,0.6,0.6,0.6h7.8c0.4,0,0.6-0.3,0.6-0.6v-0.4v-0.6
v-0.9v-0.4v-0.9v-4.9v-0.9V67v-0.9v-4.9v-0.9v-0.4V59v-5.3v-0.9v-0.4v-0.9V51v-4.3C17.3,45.6,15.4,44.8,14.4,44.8z M13.1,73.8
c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5v-1.6c0-0.3,0.3-0.5,0.5-0.5H13.1z M13.1,70.8
c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5v-1.6c0-0.3,0.3-0.5,0.5-0.5H13.1z M13.1,67.4
c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5V68c0-0.3,0.3-0.5,0.5-0.5L13.1,67.4L13.1,67.4z
 M13.1,64.5c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5V65c0-0.3,0.3-0.5,0.5-0.5H13.1z
 M13.1,61.4c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5v-1.6c0-0.3,0.3-0.5,0.5-0.5H13.1z
 M13.1,58.1c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5v-1.6c0-0.3,0.3-0.5,0.5-0.5H13.1z
 M13.1,55c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5v-1.6c0-0.3,0.3-0.5,0.5-0.5H13.1z
 M13.1,52c0.3,0,0.5,0.3,0.5,0.5v1.6c0,0.3-0.3,0.5-0.5,0.5h-2.2c-0.3,0-0.5-0.3-0.5-0.5v-1.7c0-0.3,0.3-0.5,0.5-0.5h2.2V52z
 M15.5,47.5c0.4,0,0.8,0.4,0.8,0.8v1.6c0,0.4-0.4,0.8-0.8,0.8h-4.3c-0.4,0-0.8-0.4-0.8-0.8c0-1.3,1-2.3,2.3-2.3L15.5,47.5
L15.5,47.5z"
            ></path>
            <path
              class="st1"
              d="M18.2,77.9v-34c0-0.3,0.3-0.5,0.5-0.5s0.5,0.3,0.5,0.5v34c0,0.3-0.3,0.5-0.5,0.5S18.2,78.2,18.2,77.9z"
            ></path>
          </g>
        </g>
        <g id="公交车-南" v-if="Data.controltype === 3">
          <path
            class="st0"
            d="M24,87V4c0-2.2-1.8-4-4-4H4C1.8,0,0,1.8,0,4v83c0,2.2,1.8,4,4,4h16C22.2,91,24,89.2,24,87z"
          ></path>
          <g>
            <path
              class="st1"
              d="M16.9,52.8c1,0,1.8-0.8,1.8-1.8s-0.8-1.8-1.8-1.8S15.1,50,15.1,51C15.1,51.8,15.9,52.8,16.9,52.8z M16.9,52.3
c-0.6,0-1.3-0.5-1.3-1.3s0.5-1.3,1.3-1.3c0.6,0,1.3,0.5,1.3,1.3C18.1,51.8,17.5,52.3,16.9,52.3z"
            ></path>
            <path
              class="st1"
              d="M16.9,70c1,0,1.8-0.8,1.8-1.8s-0.8-1.8-1.8-1.8s-1.8,0.8-1.8,1.8S15.9,70,16.9,70z M16.9,69.5
c-0.6,0-1.3-0.5-1.3-1.3c0-0.6,0.5-1.3,1.3-1.3c0.6,0,1.3,0.5,1.3,1.3C18.2,69,17.5,69.5,16.9,69.5z"
            ></path>
            <path
              class="st1"
              d="M10.7,77.3h4.7c0.3-1.1,0.9-3.8,1.3-5.2v-1.5c-1.3,0-2.3-1.1-2.3-2.4c0-1.3,1-2.3,2.3-2.4V53.4
c-1.3,0-2.3-1.1-2.3-2.4s1-2.3,2.3-2.4v-3.4v-0.9V44c0-0.4-0.3-0.6-0.6-0.6h-3.4l-0.4,0.8h-3c-1,0-1.8,0.8-1.8,1.8v27.6
C7.4,75.8,8.9,77.3,10.7,77.3z M9.4,48c-0.4,0-0.6-0.3-0.6-0.6v-1c0-0.4,0.3-0.6,0.6-0.6h5.7c0.4,0,0.6,0.3,0.6,0.6v0.9
c0,0.4-0.3,0.6-0.6,0.6L9.4,48L9.4,48z M9.2,55c-0.3,0-0.5-0.3-0.5-0.5v-4.9c0-0.3,0.3-0.5,0.5-0.5h2.1c0.3,0,0.5,0.3,0.5,0.5v4.9
c0,0.3-0.3,0.5-0.5,0.5H9.2z M9.2,61.8c-0.3,0-0.5-0.3-0.5-0.5v-4.9c0-0.3,0.3-0.5,0.5-0.5h2.1c0.3,0,0.5,0.3,0.5,0.5v4.9
c0,0.3-0.3,0.5-0.5,0.5C11.3,61.7,9.2,61.7,9.2,61.8z M9.2,68.5c-0.3,0-0.5-0.3-0.5-0.5v-5c0-0.3,0.3-0.5,0.5-0.5h2.1
c0.3,0,0.5,0.3,0.5,0.5v5c0,0.3-0.3,0.5-0.5,0.5H9.2z M9.2,75.3c-0.3,0-0.5-0.3-0.5-0.5v-4.9c0-0.3,0.3-0.5,0.5-0.5h2.1
c0.3,0,0.5,0.3,0.5,0.5v4.9c0,0.3-0.3,0.5-0.5,0.5C11.3,75.3,9.2,75.3,9.2,75.3z"
            ></path>
          </g>
        </g>
        <g id="BRT-南" v-if="Data.controltype === 4">
          <path
            class="st0"
            d="M24,87V4c0-2.2-1.8-4-4-4H4C1.8,0,0,1.8,0,4v83c0,2.2,1.8,4,4,4h16C22.2,91,24,89.2,24,87z"
          ></path>
          <g>
            <path
              class="st1"
              d="M3.1,88.1v-7h2.6c0.5,0,1,0,1.3,0.2c0.3,0.2,0.7,0.3,0.8,0.7c0.2,0.3,0.3,0.7,0.3,1s0,0.7-0.2,0.8
c-0.2,0.1-0.5,0.5-0.8,0.7c0.5,0.2,0.8,0.3,1,0.7c0.2,0.3,0.3,0.7,0.3,1.1c0,0.3,0,0.7-0.2,1C8,87.6,7.9,87.8,7.7,88
S7,88.2,6.9,88.2c-0.3,0-0.7,0.2-1.1,0.2H3.1V88.1z M4,87.3h1.9c0.3,0,0.5,0,0.7,0s0.3-0.2,0.5-0.2s0.2-0.3,0.3-0.5
c0.2-0.2,0.2-0.3,0.2-0.7c0-0.3,0-0.5-0.2-0.7c-0.2-0.2-0.3-0.3-0.5-0.5c-0.2,0-0.7-0.2-1-0.2H4.2L4,87.3L4,87.3z M4,84h1.5
c0.5,0,0.7,0,0.8,0s0.5-0.2,0.5-0.3C7,83.5,7,83.4,7,83c0-0.2,0-0.5-0.2-0.7C6.7,82.2,6.5,82,6.3,82c0-0.2-0.3-0.2-0.8-0.2H4V84z"
            ></path>
            <path
              class="st1"
              d="M9.8,88.1v-7h3.1c0.7,0,1.1,0,1.5,0.2c0.4,0.2,0.7,0.3,0.8,0.7c0.2,0.3,0.3,0.7,0.3,1c0,0.5-0.2,1-0.5,1.3
c-0.3,0.3-0.8,0.5-1.5,0.7c0.4,0,0.5,0,0.5,0.1c0.3,0.3,0.5,0.5,0.8,1l1.1,2h-1l-1-1.5c-0.3-0.5-0.5-0.8-0.7-1
c-0.2-0.2-0.3-0.3-0.5-0.5c-0.2-0.2-0.3-0.1-0.5-0.1s-0.3,0-0.5,0h-1.1v3.1H9.8z M10.6,84.1h2c0.5,0,0.8,0,1-0.2
c0.2-0.2,0.5-0.2,0.5-0.5c0.2-0.2,0.2-0.3,0.2-0.7c0-0.3-0.2-0.7-0.3-0.8s-0.7-0.3-1.1-0.3h-2.3L10.6,84.1L10.6,84.1z"
            ></path>
            <path class="st1" d="M18.5,88.1v-6.2h-2.3V81h5.6v0.9h-2.3v6.2H18.5z"></path>
          </g>
          <g>
            <path
              class="st1"
              d="M16.9,52.8c1,0,1.8-0.8,1.8-1.8s-0.8-1.8-1.8-1.8S15.1,50,15.1,51C15.1,51.8,15.9,52.8,16.9,52.8z M16.9,52.3
c-0.6,0-1.3-0.5-1.3-1.3s0.5-1.3,1.3-1.3c0.6,0,1.3,0.5,1.3,1.3C18.1,51.8,17.5,52.3,16.9,52.3z"
            ></path>
            <path
              class="st1"
              d="M16.9,70c1,0,1.8-0.8,1.8-1.8s-0.8-1.8-1.8-1.8s-1.8,0.8-1.8,1.8S15.9,70,16.9,70z M16.9,69.5
c-0.6,0-1.3-0.5-1.3-1.3c0-0.6,0.5-1.3,1.3-1.3c0.6,0,1.3,0.5,1.3,1.3C18.2,69,17.5,69.5,16.9,69.5z"
            ></path>
            <path
              class="st1"
              d="M10.7,77.3h4.7c0.3-1.1,0.9-3.8,1.3-5.2v-1.5c-1.3,0-2.3-1.1-2.3-2.4c0-1.3,1-2.3,2.3-2.4V53.4
c-1.3,0-2.3-1.1-2.3-2.4s1-2.3,2.3-2.4v-3.4v-0.9V44c0-0.4-0.3-0.6-0.6-0.6h-3.4l-0.4,0.8h-3c-1,0-1.8,0.8-1.8,1.8v27.6
C7.4,75.8,8.9,77.3,10.7,77.3z M9.4,48c-0.4,0-0.6-0.3-0.6-0.6v-1c0-0.4,0.3-0.6,0.6-0.6h5.7c0.4,0,0.6,0.3,0.6,0.6v0.9
c0,0.4-0.3,0.6-0.6,0.6L9.4,48L9.4,48z M9.2,55c-0.3,0-0.5-0.3-0.5-0.5v-4.9c0-0.3,0.3-0.5,0.5-0.5h2.1c0.3,0,0.5,0.3,0.5,0.5v4.9
c0,0.3-0.3,0.5-0.5,0.5H9.2z M9.2,61.8c-0.3,0-0.5-0.3-0.5-0.5v-4.9c0-0.3,0.3-0.5,0.5-0.5h2.1c0.3,0,0.5,0.3,0.5,0.5v4.9
c0,0.3-0.3,0.5-0.5,0.5C11.3,61.7,9.2,61.7,9.2,61.8z M9.2,68.5c-0.3,0-0.5-0.3-0.5-0.5v-5c0-0.3,0.3-0.5,0.5-0.5h2.1
c0.3,0,0.5,0.3,0.5,0.5v5c0,0.3-0.3,0.5-0.5,0.5H9.2z M9.2,75.3c-0.3,0-0.5-0.3-0.5-0.5v-4.9c0-0.3,0.3-0.5,0.5-0.5h2.1
c0.3,0,0.5,0.3,0.5,0.5v4.9c0,0.3-0.3,0.5-0.5,0.5C11.3,75.3,9.2,75.3,9.2,75.3z"
            ></path>
          </g>
        </g>
      </svg>
    </div>
  </div>
</template>
<script>
export default {
  name: 'southBusSvg',
  props: {
    IconLengh: {
      // 相位图标长度
      type: String,
      default: '91px'
    },
    IconWdith: {
      // 相位图标宽度
      type: String,
      default: '24px'
    },
    Data: {
      type: Object
    }
  },
  methods: {},
  mounted () {}
}
</script>
<style scoped>
.invisible {
  visibility: hidden;
}
.hide {
  display: none;
}
.st0{opacity:0.8;fill:#5F5F5F;enable-background:new;}
.st1{fill:#FFFFFF;}
</style>
